<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@page import="com.augmentum.login.Constants"%>
<%@ page import="com.augmentum.login.util.Prop"%>
<% String staticPath = Prop.get(Constants.STATIC_PATH);
   String basePath = request.getContextPath();
%>
<script type="text/javascript">
      $(document).ready(function(){

          $(".showbtn").click(function() {

              if(checkBox('selectedId')) {
                  $("#sureId").css("display", "block");
                  $("#closeBtn").css("display", "block");
                  $("#closeBtn").val("NO");
                  $("#msg01").css("display", "block");
                  $("#msg02").css("display", "none");
              } else {
                  $("#sureId").css("display", "none");
                  $("#msg01").css("display", "none");
                  $("#msg02").css("display", "block");
                  $("#closeBtn").val("YES");
              }

              $("#bg").css({
                  display : "block",
                  height : $(document).height()
              });
              var $box = $('.box');
              $box.css({
                  left : ($("body").width() - $box.width()) / 2 - 20 + "px",
                  top : ($(window).height() - $box.height()) / 2 + $(window).scrollTop() + "px",
                  display : "block"
              });
          });
          
          $(".close").click(function() {
              $("#bg,.box").css("display", "none");
          });
      });
  </script>

 <div id="bg"></div>
  <div class="box" style="display: none">
    <a href="#" style="float:right" class="close"><img alt="close" src="<%= staticPath%>/images/BTN_Close_16x16.png"></a>
    <div class="style-div"></div>
    <div class="style-div">
      <label id="msg01" style="display:block;font-family:Arial Reular;font-size: 14px;color: #0A0A0A;">Are you sure deleting selected options</label>
      <label id="msg02" style="display:none;font-family:Arial Reular;font-size: 14px;color: #0A0A0A;">please select one at least!</label>
    </div>
    <div class="style-div" style="padding-left:30%;padding-right:30%">
      <span style="display:block;float:left" id="sureId">
        <input id="confirmDelete" type="button" class="close box-input" value="YES" />
      </span>
      <span style="display:block;float:left" id="closeId">
        <input id="closeBtn" type="button" value="Cancel" class="close box-input" />
      </span>
    </div>
  </div> 